<p style="margin-left:20px;">专题基本信息</p>
<br>
<form class="layui-form">
    <div class="layui-form-item">
        <label class="layui-form-label">专题分类</label>
        <div class="layui-input-block" style="width:350px;">
            <select name="sub_type" lay-verify="required" class="sub_type">
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">话题</label>
        <div class="layui-input-inline">
            <input type="text" name="title" placeholder="请输入话题" class="layui-input sub_title" style="width:200px;">
        </div>
        <span style="margin-left: 10px;margin-top: 5px;color: gainsboro;">最大字数5</span>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">封面</label>
        <div class="layui-input-block">
            <button type="button" class="layui-btn" id="test1">上传封面</button>
            <br>
            <br>
            <input type="hidden" value="" class="sub_pic">
            <div style="width:100px;height:100px;border:1px solid darkseagreen;float: left;" >
                <img src="" style="width:100px;height: 100px;" class="image">
            </div>
            <span style="margin-left: 10px;color: gainsboro;">建议尺寸750*280</span>
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">话题简介</label>
        <div class="layui-input-inline" style="float: left;">
            <textarea name="desc" placeholder="请输入简介" class="layui-textarea sub_desc" style="width: 300px;"></textarea>
        </div>
        <span style="margin-left: 10px;margin-top: 5px;color: gainsboro;">最大字数50</span>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label"></label>
        <div class="layui-input-block">
            <button class="layui-btn save" type="button">保存</button>
            <button class="layui-btn back" type="button">返回</button>
        </div>
    </div>
</form>

<script>
    $(function(){
        //保存数据
        $('.save').click(function(){
            var sub_type=$('.sub_type').val();
            var sub_title=$('.sub_title').val();
            var sub_pic=$('.sub_pic').val();
            var sub_desc=$('.sub_desc').val();
            var a=[sub_type,sub_title,sub_pic,sub_desc]
            $.ajax({
                type: "post",
                data: {sub_type:sub_type,sub_title:sub_title,sub_pic:sub_pic,sub_desc:sub_desc},
                dataType: "json",
                url: "<?=base_url("word/words/save_word")?>",
                success: function (res) {
                    if(res.code==0){
                        layer.msg(res.msg, {time: 1000},function(){
                            window.location.href=res.data
                        });
                    }else{
                        layer.msg(res.msg, {time: 2000});
                    }
                }
            })
        })

        //上传封面
        layui.use('upload', function(){
            var upload = layui.upload;
            //执行实例
            var uploadInst = upload.render({
                elem: '#test1' //绑定元素
                , url: "<?=base_url("common/upload/normal_upload")?>"
                , data: {type: "image"}
                ,acceptMime: 'image/*'
                ,done: function(res){
                    //上传完毕回调
                    if(res.code==0){
                        layer.msg(res.msg,{time:1000},function(){
                            $('.image').attr("src",res.data.file_url)
                            $('.sub_pic').val(res.data.file_url)
                        })
                    }else{
                        layer.msg(res.msg,{time:2000})
                    }
                }
            });
        });

        //获取标签
        $.ajax({
            type: "get",
            data: {},
            dataType: "json",
            url: "<?=base_url("word/words/types")?>",
            success: function (res) {
                if(res.code==0){
//                var arr = JSON.parse(res.data);
                    var arr = res.data;
                    $.each(arr, function (i, n) {
                        $('.sub_type').append("<option value='" + n.id + "'>" + n.name + "</option>");
                    });
                    layui.form.render('select');
                }else{
                    layer.msg(res.msg, {time: 2000});
                }
            }
        })

        //返回
        $(".back").click(function(){
            history.go(-1)
        })
    })

</script>